<template>
  <div class="main">
    <el-card class="search-box">
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
        <el-form-item label="用户信息" prop="userInfo">
          <el-input
            v-model="queryParams.userInfo"
            placeholder="请输入用户信息"
            clearable
            @keyup.enter.native="getList"
          />
        </el-form-item>
        <el-form-item label="提现用户端：" prop="businessType">
          <el-select
            v-model="queryParams.businessType"
            placeholder="请选择提现用户端"
          >
            <el-option label="用户端" value="1"></el-option>
            <el-option label="门店端" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="状态" prop="status">
          <el-select v-model="queryParams.status" placeholder="请选择">
            <el-option
              v-for="item in statusList"
              :key="item.value"
              :label="item.key"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="创建时间" prop="time">
          <el-date-picker
            v-model="value"
            @change="selectTime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            type="daterange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :default-time="['00:00:00', '23:59:59']"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="getList"
            >查询</el-button
          >
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="table-box">
      <el-table
        :data="tableData"
        v-loading="loading"
        :header-cell-style="{
          background: '#f5f7fa',
          color: '#000000',
        }"
        style="width: 100%"
      >
        <el-table-column prop="withdrawClient" label="提现用户端">
        </el-table-column>
        <el-table-column prop="applyUser" label="申请人"> </el-table-column>
        <el-table-column prop="withdrawMoney" label="提现金额">
        </el-table-column>
        <el-table-column prop="withdrawBankAccount" label="收款账户">
        </el-table-column>
        <el-table-column prop="withdrawStatus" label="状态"> </el-table-column>
        <el-table-column prop="applyTime" label="申请时间"> </el-table-column>
        <el-table-column prop="edit" label="操作" width="300">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="success"
              @click="userDetails(scope.row.id)"
            >
              详情
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNumber"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </el-card>
  </div>
</template>
  
  <script>
import { queryWithdrawList, queryWithdrawStatus } from "@/api/withdraw";
import Pagination from "@/components/Pagination";
export default {
  name: "",
  components: { Pagination },
  props: {},
  data() {
    return {
      options: [
        {
          value: "1",
          label: "平台用户",
        },
        {
          value: "2",
          label: "讲师",
        },
      ],
      queryParams: {
        businessType: null,
        userInfo: "",
        status:'',
        startTime: "",
        endTime: "",
        pageSize: 10,
        pageNumber: 1,
      },
      loading: true,
      value: "",
      total: 0,
      tableData: [],
      statusList: [],
    };
  },
  watch: {},
  computed: {},
  methods: {
    resetQuery() {
      this.queryParams = {
        userInfo: "",
        businessType: "",
        status: "",
        startTime: "",
        endTime: "",
        pageSize: 10,
        pageNumber: 1,
      };
      this.getList();
    },
    selectTime(val) {
      this.queryParams.startTime = val[0] + "";
      this.queryParams.endTime = val[1] + "";
    },
    async getList() {
      const res = await queryWithdrawList(this.queryParams);
      this.loading = false;
      this.tableData = res.data.list;
      this.total = res.data.total;
    },
    async getStatusData() {
      const res = await queryWithdrawStatus(this.queryParams);
      this.statusList = res.data;
    },
  },
  created() {
    this.getStatusData();
    this.getList();
  },
  mounted() {},
};
</script>
  
  <style lang="less" scoped>
</style>